<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<script type="text/javascript">
    var a = Array();

    a[0] = 1;
    a[1] = 2;
    console.log(a);

    // 当我们使用Array()构造器创建新数组时，也可以通过传值的方式为其设定元素。
    var b = new Array(1,2,3,'four');
    console.log(b);

    // 但是如果我们传递给该构造器的是一个单独的数字，就会出现一种异常情况，即该数组会被认为是数组的长度
    var c = new Array(5);
    console.log(c);

    // 既然数组时由构造器来创建的，那么这是否意味着数组实际上是一个对象呢？的确如此，我们可以用typeof操作符来验证一下
    console.log(typeof [1,2,3]);

    // 由于数组也是对象，那么就说明它也继承了object的所有方法和属性
    console.log(b.toString());
    console.log(b.valueOf());
    console.log(b.constructor);
</script>
<script type="text/javascript">
    var a = [],
        o = {};

    // 首先，定义数组对象时会自动生成一个length属性，而这一般在对象中是没有的
    console.log(a.length);
    console.log(typeof o.length);

    // 在为数组和对象添加以数字或非数字为键名的属性操作上，两者间并没有什么太大的差距
    a[0] = 1;
    o[0] = 1;

    a.prop = 2;
    o.prop = 2;

    // length属性通常会跟着数字键名属性的数量而更新，而忽略非数字键名属性
    console.log(a.length);

    // 我们也可以手动设置length属性。如果设置的值大于当前数组中的元素数量，剩下的那部分会被自动创建（值为undefined）的空元素所填充
    a.length = 5;
    console.log(a);

    // 而如果我们设置的length值小于当前元素值，多出的那部分元素将会被移除
    a.length = 2;
    console.log(a);

</script>
<script type="text/javascript">
    var a = [3,5,1,7,'test'];

    // push()方法会在数组的末端添加一个新元素，而pop()方法则会移除最后一个元素，也就是说a.push('new')就相当于a[a.length] = 'new'，而a.pop()则与a.length--的结果相同
    // 另外，push()返回的是改变后的数组的长度，而pop所返回的则是被移除的元素。
    console.log(a.push('new'));
    console.log(a);
    console.log(a.pop());
    console.log(a);

    // 而sort()方法则是用于给数组排序的，他会返回排序后的数组，而排序完成后，a和b所指向的数组是相同的
    var b = a.sort();
    console.log(b);
    console.log(a === b);

    // join()方法会返回一个由目标数组中所有元素值用符号链接成的字符串，我们可以通过该方法的参数来设定这些元素之间用什么字符串链接。
    console.log(a.join(' is not '));

    // slice()方法会在不修改目标数组的情况下返回其中的某个片段，该片段的首尾索引位置将由slice()的头两个参数来指定（都以0位基础）
    c = a.slice(1,3);
    console.log(c);

    d = a.slice(0,1);
    console.log(d);

    // 截取完之后，原数组的状态不变
    console.log(a);

    // splice()则是会修改目标助手的。它会移除并返回指定切片，并且在可选情况下，他还会用指定的新元素来填补被切除的元素。该方法的头两个参数所指定的是要移除切片的首尾索引位置，其他参数则用于填补的新元素值
    e = a.splice(1,2,100,101,102);
    console.log(e);
    console.log(a);

    // 当然，用于填补空缺的新元素也是可选的，我们也可以直接跳过
    a.splice(1,3);
    console.log(a);
</script>
</body>
</html>
